<template>
  <div class="box1">
    <h1>这是header的mapState方法取值{{count1}}</h1>
    <button @click="increment">点击累加</button>
    <button @click="incrementN({n:5})">点击加n</button>
  </div>
</template>

<script>
import { mapState,mapMutations } from 'vuex'

export default {
    name:"Header",
    mounted(){
        console.log();
    },
    //针对值的变化,获取值
    computed:{
        // mapState方法取值的对象写法
        ...mapState({count1:'count'}),
    },
    //事件函数
    methods: {
         //这里是简略写法
        ...mapMutations(['increment','incrementN'])
        //原写法
        // increment(){
        //     //对mutation上的事件进行提交
        //     this.$state.commit("increment")
        // }
        
        //如果有传参的话,使用简略写法,只能在这边传递一个对象
    },
}
</script>

<style>
.box1{
    width: 100%;
    height: 150px;
    background-color: aquamarine;
    text-align: center;
}
</style>